<template>
	<el-container>
        <el-card shadow="never">
            <el-tabs tab-position="top">
                <el-tab-pane label="日常收入">
                    <el-container>
                        <el-header>
                            <div class="left-panel">
                                <!-- <el-button type="primary" icon="el-icon-Plus" @click="open('put')">新增收入</el-button> -->
                                <el-button type="primary" icon="el-icon-Plus" @click="addReve">新增收入</el-button>
                                <el-button type="primary">导出</el-button>
                            </div>
                        </el-header>
                        <el-main>
                        <scTable ref="table" :apiObj="apiObj" stripe remoteSort remoteFilter border height="670">
                            <el-table-column label="序号" type="index" width="100" align="center"></el-table-column>
                            <el-table-column label="操作" width="200" align="center">
                                <template #default="scope">
                                    <el-button-group>
                                        <el-button text type="primary" size="small" @click="table_edit(scope.row, scope.$index)">复制</el-button>
                                        <el-button text type="primary" size="small" @click="table_show(scope.row, scope.$index)">作废</el-button>
                                    </el-button-group>
                                </template>
                            </el-table-column>
                            <el-table-column label="业务日期" prop="title" width="200" align="center"></el-table-column>
                            <el-table-column label="制单日期" prop="cate_name" width="200" align="center"></el-table-column>
                            <el-table-column label="单据编号" prop="sort" width="200" align="center"></el-table-column>
                            <el-table-column label="单据状态" prop="cate_name" width="200" align="center"></el-table-column>
                            <el-table-column label="付款单位" prop="cate_name" width="200" align="center"></el-table-column>
                            <el-table-column label="收入项目" prop="cate_name" width="200" align="center"></el-table-column>
                            <el-table-column label="金额(元)" prop="cate_name" width="200" align="center"></el-table-column>
                            <el-table-column label="收入账户" prop="cate_name" width="200" align="center"></el-table-column>
                            <el-table-column label="经手人" prop="cate_name" width="200" align="center"></el-table-column>
                            <el-table-column label="制单人" prop="cate_name" width="200" align="center"></el-table-column>
                            <el-table-column label="备注" prop="cate_name" width="200" align="center"></el-table-column>
                        </scTable>
                    </el-main>
                    </el-container>
                </el-tab-pane>
                <el-tab-pane label="日常支出">
                    <el-container>
                        <el-header>
                            <div class="left-panel">
                                <!-- <el-button type="primary" icon="el-icon-Plus" @click="open('pay')">新增支出</el-button> -->
                                <el-button type="primary" icon="el-icon-Plus" @click="addExpen">新增支出</el-button>
                                <el-button type="primary">导出</el-button>
                            </div>
                        </el-header>
                        <el-main>
                            <scTable ref="table" :apiObj="apiObj" stripe remoteSort remoteFilter border height="670">
                                <el-table-column label="序号" type="index" width="100" align="center"></el-table-column>
                                <el-table-column label="操作" width="200" align="center">
                                    <template #default="scope">
                                        <el-button-group>
                                            <el-button text type="primary" size="small" @click="table_edit(scope.row, scope.$index)">复制</el-button>
                                            <el-button text type="primary" size="small" @click="table_show(scope.row, scope.$index)">作废</el-button>
                                        </el-button-group>
                                    </template>
                                </el-table-column>
                                <el-table-column label="业务日期" prop="title" width="200" align="center"></el-table-column>
                                <el-table-column label="制单日期" prop="cate_name" width="200" align="center"></el-table-column>
                                <el-table-column label="单据编号" prop="sort" width="200" align="center"></el-table-column>
                                <el-table-column label="单据状态" prop="cate_name" width="200" align="center"></el-table-column>
                                <el-table-column label="付款单位" prop="cate_name" width="200" align="center"></el-table-column>
                                <el-table-column label="收入项目" prop="cate_name" width="200" align="center"></el-table-column>
                                <el-table-column label="金额(元)" prop="cate_name" width="200" align="center"></el-table-column>
                                <el-table-column label="收入账户" prop="cate_name" width="200" align="center"></el-table-column>
                                <el-table-column label="经手人" prop="cate_name" width="200" align="center"></el-table-column>
                                <el-table-column label="制单人" prop="cate_name" width="200" align="center"></el-table-column>
                                <el-table-column label="备注" prop="cate_name" width="200" align="center"></el-table-column>
                            </scTable>
                        </el-main>
                    </el-container>
                </el-tab-pane>
            </el-tabs>
        </el-card>
    </el-container>
    <add-reve v-if="dialog.reve" ref="reveDialog" @success="handleSuccess" @closed="dialog.reve = false" draggable></add-reve>
    <add-expen v-if="dialog.expen" ref="expenDialog" @success="handleSuccess" @closed="dialog.expen = false" draggable></add-expen>
</template>

<script>
import AddExpen from './addExpen.vue';
import addReve from './addReve.vue';
export default {
  components: { addReve, AddExpen },
	name: 'user',
	data() {
		return {
            dialog: {
                reve: false,
                expen: false,
            },
			apiObj: this.$API.customer.getCustomerList.lists,
			search: {
				title: null,
				cid: null,
			},
			//所需数据选项
			cates: [],
		}
	},
	mounted() {
		this.getCate()
	},
	methods: {
		//加载树数据
		async getCate(){
				var res = await this.$API.customer.getBrand.lists.get();
				this.cates = res.data.rows;
			},
		//添加
		open(e){
            this.type = e
            if(e == 'put'){
                this.title = '新增收入'
            }else{
                this.title = '新增支出'
            }
            this.dialog = true
        },
        // 收入
        addReve() {
			this.dialog.reve = true
			this.$nextTick(() => {
				this.$refs.reveDialog.open('add')
			})
		},
        // 支出
        addExpen() {
			this.dialog.expen = true
			this.$nextTick(() => {
				this.$refs.expenDialog.open('add')
			})
		},
	}
}
</script>

<style lang="scss" scoped>
</style>
